import React from "react";
import BaseComponent from "../../redare/components/BaseComponent";
import {Empty,Skeleton} from "antd";

export default class SkeletonDivs extends BaseComponent{

  static defaultProps = {
    num: 1,
    loading: true,
    rows: 3, // ant SkeletonParagraphProps 默认为 2+1,
    ismargin: true, // 是否显示额外的边距
    shownull: false // 是否显示空数据
  };

  constructor(props) {
    super(props);
  }

  render() {

    let {num,children,loading,rows,ismargin,shownull} = this.props;
    let marginCss = ismargin ? 'margin24' : '';
    let paddingCss = ismargin ? 'padding24' : '';

    let renderNodes= [];
    for(let i= 0 ; i < num; i ++){
      let _rows = rows;
      if( i !== 0 ){
          _rows = 4;
      }
      renderNodes.push(
        <div key={'Skeleton_div_'+i} className={ marginCss }>
          <Skeleton active  className={'bg-white '+ paddingCss }  paragraph={{rows: _rows}}/>
        </div>
      );
    }

    let node = loading ? renderNodes : children;
    if( shownull ){
        node = <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
    }

    return ( <>{ node }</> );
  }

}